<template>
  <div class="app-container">
    <map-container class="map-container" :showquerybtn="true" @viewHandle="viewHandle"> </map-container>
    <div class="map-tools" v-if="false">
      <div class="page-tool-bar">
        <div class="index-toolbar clear" style="right: 130px">
          <div class="item tool-bar-tip"><i class="map-icon icon1"></i></div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon2"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon3"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon4"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon5"></i>
          </div>
          <div class="item tool-bar-tip ant-dropdown-trigger" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon13"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon-point"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon-rectangle"></i>
          </div>
          <!----><!----><!---->
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon10"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon11"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon12"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon16"></i>
          </div>
          <div class="item tool-bar-tip" effect="light" popper-class="tool-bar-tip">
            <i class="map-icon icon9"></i>
          </div>
        </div>
        <div class="div-tab1" style="right: 50px">
          <div class="hide-btn" effect="dark"></div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import mapContainer from "../components/Map/mapContainer";
import * as echarts from "echarts";
import { mapState, mapGetters, mapActions, mapMutations } from "vuex";
export default {
  components: {
    mapContainer,
  },
  data() {
    return {
      mapview: undefined,

    }
  },
  computed: {
    ...mapGetters("mapStore", [
      "dianzldFeatureLayer",
      "qitaldFeatureLayer",
      "roadldFeatureLayer",
      "gusmmFeatureLayer",
      "greenlandLayers",
      "shequFeatureLayer"
    ]),
  },
  mounted() {

  },
  methods: {
    viewHandle: function (value) {
      this.mapview = value;
      //添加业务图层
      this.mapview.map.addMany([
        this.shequFeatureLayer,
        this.roadldFeatureLayer,
        this.qitaldFeatureLayer,
        this.dianzldFeatureLayer,
        this.gusmmFeatureLayer,

      ]);
    },

  },
};
</script>

<style lang="scss" scoped>
.app-container,
.map-container {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}

//@import url("./tools.css");
</style>
